//下拉按钮跳动动画
let SlideMove = () => {
  $(".videoContenerSlide").animate({ bottom: "22%" }, 100);
  $(".videoContenerSlide").animate({ bottom: "23.5%" }, 200);
  $(".videoContenerSlide").animate({ bottom: "24.5%" }, 300);
  $(".videoContenerSlide").animate({ bottom: "26%" }, 500);
};
SlideMove();
setInterval(function () {
  SlideMove();
}, 1500);

//点击下拉按钮滚动动画
let tagetH = $(".company-intrduce").offset().top;
$(".videoContenerSlide").click(function () {
  $("html").animate({ scrollTop: tagetH }, 400);
});

let head = $(".ch-head");
let hidden = $("#swiper").offset().top;
let side = $(".side");
$(document).scroll(function () {
  $(this).scrollTop() > tagetH
    ? head.css({
        position: "fixed",
        "background-color": "rgba(0, 0, 0, 0.7)",
        height: "70px",
      })
    : head.css({
        position: "absolute",
        "background-color": "rgba(0, 0, 0, 0.2)",
        height: "100px",
      });
  $(this).scrollTop() > hidden
    ? side.css("display", "flex")
    : side.css("display", "none");
});
side.click(function () {
  $("html").animate({ scrollTop: 0 }, 800);
});

let item1 = $(".ch-item1");
let item2 = $(".ch-item2");
let item3 = $(".ch-item3");
let item4 = $(".ch-item4");
let item5 = $(".ch-item5");
let in1 = $(".company-intrduce").offset().top;
let in2 = $(".shop-intrduce").offset().top;
let in3 = $(".shops").offset().top;
let in4 = $(".userVideo").offset().top;
let in5 = $(".footerTop").offset().top;
let instanceArr = [in1, in2, in3, in4, in5];
let itemArr = [item1, item2, item3, item4, item5];
$.each(itemArr, function (index, item) {
  item.click(function () {
    $("html").animate({ scrollTop: instanceArr[index] }, 600);
  });
});

$(".w40").hover(
  function () {
    $(this)
      .css({ "transform": "scale(1.1)", "z-index": 8 })
      .siblings(".w50")
      .css("z-index", 7);
  },
  function () {
    $(this)
      .css({ "transform": "scale(1)", "z-index": 7 })
      .siblings(".w50")
      .css("z-index", 8);
  }
);
